<template>
    <div class="subHeadWrap">
        <div class="subImage"></div>
        <div class="line"></div>
        <span>{{ title }}</span>
    </div>
</template>
<script>
export default {
    name: 'SubHead',
    props: {
        title: {
            type: [String, Number],
        }
    },
}
</script>
<style lang="less" scoped>
.subHeadWrap {
    width: 100%;
    height: 30px;
    position: relative;
    display: flex;
    align-items: center;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: 2px;
    // background-image: url(~@/assets/images/screen/headTitleBk.png);
    // background-size: 100% 100%;

    .subImage {
        position: absolute;
        right: 0px;
        height: 10px;
        top: calc(50% - 5px);
        width: 60px;
        background-image: url(~@/assets/images/screen/titleExtra.png);
        background-size: 100% 100%;
    }

    .line {
        height: 24px;
        width: 8px;
        background-color: #F1ED5A;
        margin-right: 4px;
        // display: none;
    }
}
</style>